{% extends 'layouts/base.html' %}
{% block content %}
<div class="row">
    <div class="col-xs-12">
        <!-- PAGE CONTENT BEGINS -->
        <div class="row">
            <div class="col-xs-12" id="permission">
                <form method="post" action="{{  url('backend/roles/editpermission', {'id':id}) }}">
                {% for row in result %}
                <ul>
                {% if row.sub %}
                <li><label><input type="checkbox" value="{{row.id}}" name="rp[]" class="allcheck"{% if rpArr[row.id] %} checked="checked"{% endif %}/>{{ row.name }}</label></li>
                    {% for item in row.sub%}
                    <ol><label><input type="checkbox" value="{{item.id}}" name="rp[]" class="itemcheck"{% if rpArr[item.id] %} checked="checked"{% endif %}/>{{ item.name }}</label></ol>
                    {% endfor %}
                {% else %}
                <li><label><input type="checkbox" value="{{row.id}}" name="rp[]"{% if rpArr[row.id] %} checked="checked"{% endif %}/>{{ row.name }}</label></li>
                {% endif %}
                </ul>
                {% endfor %}
                <p><input type="submit" value="  提交 "></p>
                </form>
            </div><!-- /.span -->
        </div><!-- /.row -->
    </div>
</div>

<!-- inline scripts related to this page -->
{% endblock %}
{% block script %}
<style type="text/css" media="screen">
    ol{ float:left; margin:5px;   }
    li, p{  clear:both }
</style>
<script type="text/javascript" charset="utf-8">
    $(document).on('click', '#permission .allcheck' , function(){
        var that = this;
        $(this).parent().parent().parent().find('ol input:checkbox').each(function(){
            this.checked = that.checked;
        });
    });
    $(document).on('click', '#permission .itemcheck', function(){
        var that = this;
        if(this.checked){
            $(this).parent().parent().parent().find('li input:checkbox').each(function(){this.checked = that.checked});
        }
    });
</script>
{% endblock %}
